<{extends "../Layout/default.html"}>
<{block name="main"}>
<div class="container">
    <div class="membeys-box">

        <header class="header">当前成员 <span class="t"><{$userList.paging.total_items}></span> 个</header>

        <ol class="clearfix" id="nodelist">
        </ol>
    </div>
</div>
<script type="text/javascript" src="/js/jquery-3.1.0.min.js"></script>
<script type="text/javascript" src="/js/dropload.min.js"></script>
<script>
    var url = '/user/ajax_wechat_users'

    $(function () {
        function loadlist() {
            var cur_page = 0;
            var total_page = 0;

            $('#nodelist').dropload({
                scrollArea: window,
                loadDownFn: function (me) {

                    var dom = '';
                    cur_page++

                    $.post(url, {
                        page: cur_page
                    }, function (data) {
                        if (cur_page == 1)
                            $("#nodelist").html('')

                        // 获取 分页总数
                        total_page = <{$userList.paging.total_page}> ;
                                if (cur_page <= total_page) {
                            // 获取组装的DOM
                            dom = breakDownData(data.items);
                            // 加载全部数据，不再监听滚动
                            if (cur_page == total_page) {
                                me.lock();
                                me.noData();
                            }
                        } else {
                            me.lock();
                            me.noData();
                        }

                        // append DOM
                        $("#nodelist").append(dom)
                        me.resetload();

                        isLoading(false)
                    }, 'json')
                }
            });
        }

        function breakDownData(data) {
            var dom = '';
            $(data).each(function (i, o) {
                o.headimgurl = o.headimgurl ? o.headimgurl : '<{$codeConfig.defaultHead}>';
                dom += '<li>'
                dom += '<a class="avatar" style="background-image: url(' + o.headimgurl + ')"></a>'
                dom += '<div class="name">' + o.username + '</div>'
                dom += '</li>'
            })
            return dom
        }

        function isLoading(flag) {
            if (flag) {
                $(".dropload-down").show()
            } else {
                $(".dropload-down").hide()
            }
        }
        // 开启 滚动监听 拉取数据
        loadlist()
        isLoading(true)

    });
</script>
<{/block}>